<template>
    <link rel="stylesheet" href="/assets/css/my.css">

    <div class="usercenter">
        <div class="header">
            <div class="header_title">
                <div class="title_avatar">
                    <img :src="business.avatar_cdn" alt="">
                </div>
                <div class="title_content">
                    <div class="content_text">{{ business.nickname }}</div>
                    <div class="content_sm">{{ business.createtime_text }}</div>
                </div>
            </div>
        </div>
        <div class="userorder">
            <div class="order_project">
                <div class="item">
                    <a href="order.html" class="item">
                        <div class="img">
                            <img src="/assets/images/order2.png" alt="">
                        </div>
                        待发货
                    </a>
                </div>
                <div class="item">
                    <a href="order.html" class="item">
                        <div class="img">
                            <img src="/assets/images/order3.png" alt="">
                        </div>
                        待收货
                    </a>
                </div>
                <div class="item">
                    <a href="order.html" class="item">
                        <div class="img">
                            <img src="/assets/images/order4.png" alt="">
                        </div>
                        待评价
                    </a>
                </div>
                <div class="item">
                    <a href="order.html" class="item">
                        <div class="img">
                            <img src="/assets/images/returns.png" alt="">
                            
                        </div>
                        退货/售后
                    </a>
                </div>
                <div class="item solid-left">
                    <router-link to="/product/order/index" class="item">
                        <div class="img">
                            <img src="/assets/images/order1.png" alt="">
                        </div>
                        全部订单
                    </router-link>
                </div>
            </div>
        </div>
        <div class="userorder">
            <div class="order_project">
                <div class="item">
                    <a href="retail.html" class="item">
                        <div class="img"> <img src="/assets/images/retail1.png" alt=""></div>
                        分销信息
                    </a>
                </div>
                <div class="item">
                    <a href="retailmember.html" class="item">
                        <div class="img"> <img src="/assets/images/retail2.png" alt=""></div>
                        分销会员
                    </a>
                </div>
                <div class="item">
                    <a href="kickback.html" class="item">
                        <div class="img"> <img src="/assets/images/retail3.png" alt=""></div>
                        分销佣金
                    </a>
                </div>
                <div class="item">
                    <router-link  to="/business/base/mycoupon" class="item">
                        <div class="img"> <img src="/assets/images/coupon.png" alt=""></div>
                        优惠列表
                    </router-link>
                </div>
                <div class="item solid-left">
                    <a href="deposit.html" class="item">
                        <div class="img"> <img src="/assets/images/recharge2.png" alt=""></div>
                        充值中心
                    </a>
                </div>
            </div>
        </div>
        <div class="usertool">
            <div class="list">
                <div class="item">
                    <router-link to="/business/base/profile">
                        <div class="img">
                            <img src="/assets/images/profile.png" alt="">
                        </div>
                        基本资料
                    </router-link>
                </div>
                <div class="item">
                    <a href="order.html">
                        <div class="img"> <img src="/assets/images/pingtuan.png" alt=""></div>
                        拼团订单
                    </a>
                </div>
                <div class="item">
                    <router-link to="/business/address/index">
                        <div class="img"> <img src="/assets/images/address.png" alt=""></div>
                        收货地址
                    </router-link>
                </div>
                <div class="item">
                    <router-link to="/business/base/email">
                        <div class="img"> <img src="/assets/images/email.png" alt=""></div>
                        邮箱认证
                    </router-link>
                </div>
                <div class="item">
                    <a href="record.html">
                        <div class="img"> <img src="/assets/images/consume.png" alt=""></div>
                        消费记录
                    </a>
                </div>
                <div class="item">
                    <a href="record.html">
                        <div class="img"> <img src="/assets/images/recharge1.png" alt=""></div>
                        充值记录
                    </a>
                </div>

                <div class="item">
                    <a @click="onLogout">
                        <div class="img"> <img src="/assets/images/logout_1.png" alt=""></div>
                        退出账号
                    </a>
                </div>
            </div>
        </div>
        <div class="usertool">
            <ul class="proul">
                <li>
                    <a href="detail.html"><img src="/assets/images/7.jpg" /></a>
                    <a href="detail.html">
                        <p class="tit">北欧轻奢餐椅家用现代简约新中式洽谈酒店皮革软包餐厅椅子靠背椅</p>
                    </a>
                    <div class="price">
                        <p>￥2998</p>
                    </div>
                </li>
                <li>
                    <a href="detail.html"><img src="/assets/images/4.jpg" /></a>
                    <a href="detail.html">
                        <p class="tit">松兰宾利实木餐桌椅组合后现代轻奢长方形大户型不锈钢8人饭桌</p>
                    </a>
                    <div class="price">
                        <p>￥998</p>
                    </div>
                </li>
                <li>
                    <a href="detail.html"><img src="/assets/images/5.jpg" /></a>
                    <a href="detail.html">
                        <p class="tit">卫生间洗手台柜面池洗睑台式壁挂台盆架瓷盥洗池饭店小号挂盆经济</p>
                    </a>
                    <div class="price">
                        <p>￥368</p>
                    </div>
                </li>
                <li>
                    <a href="detail.html"><img src="/assets/images/6.jpg" /></a>
                    <a href="detail.html">
                        <p class="tit">布艺床主卧大床双人床港式轻奢ins网红床卧室北欧家具床现代简约</p>
                    </a>
                    <div class="price">
                        <p>￥3998</p>
                    </div>
                </li>
            </ul>
        </div>
        <div class="h54"></div>
        <div class="clear"></div>
    </div>
    <Footer />
</template>

<script setup>
import Footer from '@/components/common/Footer.vue';

const { proxy } = getCurrentInstance();

const business = ref(proxy.$business);

const onLogout = () => {
    proxy.$showConfirm({
        title:'退出账号',
        message:'是否确认退出当前账号？',
    }).then(() => {
        proxy.$successNotify({
            message:'退出成功',
            onClose:() => {
                proxy.$cookies.remove('business');

                proxy.$router.push('/business/base/login');
            }
        });

        return false;
    }).catch((err) => {
        
    });
}
console.log(business);
</script>

<style>
.usercenter .usertool {
    margin-top: 13px;
}

ul.proul li .tit{
    padding: unset;
}

ul.proul li .price{
    padding: 5px 0 10px;
}
</style>